<script src="<?php echo base_url()?>js/jquery.nivo.slider.js" type="text/javascript"></script>
<link href="<?php echo base_url()?>css/nivo-slider.css" media="screen" rel="stylesheet" type="text/css" />

<script>
    $().ready(function(){
        
        $("#branch_box ul li a").click(function(){
            
            $.get('<?php echo base_url();?>booking/get_movie_by_branch/'+$(this).attr('rel'), function(data) {
              $('#movie_choose_box .body').html(data);
            });
            $('#schedule_choose_box .body').html('');
        });
        
    });
</script>

<script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider({
            pauseTime:5000,
            pauseOnHover:false,
            controlNavThumbs:true
        });
    });
</script>

<div id="slider-wrapper">
        
    <div id="slider" class="nivoSlider">
        <?php foreach($contents as $index => $content):?>
		    <a href="<?php echo site_url('content/view/'.$content->id);?>"><img title="<?php echo $content->title;?>" src="<?php echo base_url().'uploads/content/'.$content->id.'.jpg';?>"/></a>
		<?php endforeach ?>
    </div>
</div>


<div id="branch_box" class="branch_box movie_box">
    
    <h3>1. SELECT A CINEMA:</h3>
    <div class="body">
        <ul>
            <?php foreach($branchs as $index => $branch):?>
            <li class="<?php echo ($index%2 == 0)?"even":"";?>"><a href="javascript:void(0);" class="branch_id" rel="<?php echo $branch->id;?>"><?php echo $branch->name;?></a></li>
            <?php endforeach?>
        </ul>    
    </div>    
</div>    

<div id="movie_choose_box" class="movie_choose_box movie_box">
    
    <h3>2. SELECT A MOVIE:</h3>
    <div class="body">
          
    </div>    
</div>   

<div id="schedule_choose_box" class="schedule_choose_box movie_box">
    
    <h3>3. SELECT A SHOWTIME:</h3>
    <div class="body">
          
    </div>    
</div>
<div class="clear"></div>